<template>
  <div>
    <input v-for="json,index in arr" v-bind:key="json.id" type="button" :value="'按钮' + index" @click="fn(index)">
    <div class="box" v-for="json,index in arr" v-if="json.show" v-bind:key="json.id">{{index}}</div>
  </div>
</template>

<script>
export default {
  name: 'HelloWorld',
  data () {
    return {
      arr: [
        {id: 1, show: true},
        {id: 2, show: true},
        {id: 3, show: true},
        {id: 4, show: true}
      ]
    }
  },
  methods: {
    fn (index) {
      this.arr[index].show = !this.arr[index].show
    }
  }
}
</script>

<style>
  .box {
    width: 200px;
    height: 100px;
    background: #ccc;
    border: 1px solid black;
  }
</style>
